API Gitlab Ticket Update

Development
1

Hi, I creating an extension. I want to add an issue link to the ticket with api.
This endpoint (…/api/v1/integration/gitlab_ticket_update) work in Postman or PHP but i need to use in javascript with fetch. (Note: I sent Bearer token in headers)
If i send a request the point in javascript;
Response:

{
    "error": "CSRF token verification failed!",
    "error_human": "CSRF token verification failed!"
}

but if I send a same request in Postman or PHP it’s work…

2

Looks like your js code is broken then. There should be no CSRF check if you use the token in the headers.

Without some code example nobody will be able to help you here.

https://github.com/zammad/zammad/blob/5a81e629ee1236e060b271a91155206c4a28f130/app/controllers/application_controller/prevents_csrf.rb#L27-L37

3

Hi, thanks for your response. I can arrive at this API endpoint (…/api/v1/tickets/{ticket id}) with the same header options. I put the Access token in the Bearer token of headers. I try to arrive from the Chrome extension background.js. Maybe, security settings do not permit connecting from Chrome extensions…

4

Hi, i can’t solved this problem. I watched request headers and i seen bearer token added. If i try to request in Postman, that worked.

index.js code;

let formData = new FormData();
                        formData.append("ticked_id", ticketId);
                        formData.append("issue_links[]", window.location.href);


                        let requestOptions = {
                            method: 'POST',
                            body: formData,
                            redirect: 'follow',
                            headers: {"Authorization":`Bearer ${bearerToken}`}
                        };

                        chrome.runtime.sendMessage({action:'post',apiUrl:apiUrl,requestOptions:requestOptions});

background.js code;

chrome.runtime.onMessage.addListener(async function (request, sender, sendResponse) {
    if (request.hasOwnProperty("action") && request.action === "post") {

        console.log(request);
        fetch(request.apiUrl, request.requestOptions)
            .then(response => response.json())
            .then(data => {
                if (data.error) {
                    console.error('Error: ', data.error);
                    console.error('Error description: ', data.error_human);
                } else {
                    console.log(data);
                }
            })
            .catch(error => {
                console.error('Request error:', error);
            });

    }
});
5

Not sure I can’t really test it. How can I run it?

Maybe the content type is missing?

headers: {"Authorization":`Bearer ${bearerToken}`, "Content-Type": "application/json"}
1 Like
6

You could also try to tail the production log and see if there is a difference between your postman request and your new js request.

cd /opt/zammad
tail -f log/production.log
1 Like
7

If i added “Content-Type”: “application/json”, error statu changed to 500.
Postman send to data with “Content-Type” : “multipart/form-data”. I tried that but not working. It continue the error of CSRF token… Maybe i need to look the log file…

8

@yasinsatar I did some research.

You are building a chrome extension, so your code runs browser based. I would guess that it includes cookies and then the servers prefers the existing zammad session you might have open in your browser.

checkout this example:

const url = 'https://xxx.com/api/v1/integration/gitlab_ticket_update';
const data = {
  ticket_id: 195,
  issue_links: ['https://git.xxxx/addons/-/issues/12']
};

fetch(url, {
  method: 'POST',
  credentials: "omit",
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Token token=xxx-WiXzCEsNAQh1bXmgU'
  },
  body: JSON.stringify(data)
})
.then(response => {
  if (!response.ok) {
    throw new Error('Network response was not ok');
  }
  return response.json();
})
.then(data => {
  console.log('Response:', data);
})
.catch(error => {
  console.error('Error:', error);
});

credentials: omit might be your missing piece to success.