I have a form to book a flight with standard fields: Flight date, from, to , flight hour, flight min, etc…
My request is from all the information’s I get from clients, I want to create an event in a google calendar when the client click on submit the flight ?
Any ideas how I can deal this quite complex requirement ?
Many thanks
Pierre-yves
Hi Pierre,
wix code allows you to integrate with APIs available on the web, in this example a short google search came up with this
please learn more about the api you need, the format of the data needed and authentication options, then implement a backend code that will integrate with it that will be invoked on the user action
good luck!
Shlomi
Dear Shlomi,
Many thanks for your answer.
I checked the google link. I understood the logic…
I am quite new in wix and java and I don’t see how I can implement a backend code and integrate it wix ?
Do you know where I can find an example in wix ?
Many thanks for your help
Regards,
Pierre-yves
Hi Pierre,
Wix code lets you write code under the backend folder in your editor, using JavaScript, and invoke it as a simple function. please see the following example here:
basically, it means you can invoke any api available out there in the web using REST (http) from your site backend.
Shlomi
thanks Shlomi,
In the google doc there are speaking about a script to load
Load the Google APIs platform library to create the gapi object:
In my case, I can’t do that, can I?
To load I have to create a js file with a function? Is it correct?
export function initGoogle() {
const url = “https://apis.google.com/js/platform.js?onload=init”;
………………
How can I know which parameters I have to setup ?
Sorry for my questions, I have difficulties to transpose the sendGrid example with my google request…
Thanks again
Regards,
pym
Hi again,
the above are scripts to be downloaded and use in your user’s browser, since you’d need to allso provide your calendar id and credentials this is not the way we want to do it, actually i recommended you use their http api from your backend code, just like the example of using sendgrid api to send an email, just here it is google calendar.
please have a look at the parameters google allow you to use here:
i guess some of the data will be taken from the user input while the other like calendar id etc will be provided by you, just like the send grid example.
Shlomi
hi again,
I tried to modify the sendgrid example without success, with a backend file, i can’t really debbug…
This is really difficult for me, i am gonna tried to find example with work on the google api instead of sendgrid
once again thx for your help
regards,
pym
Hi pym,
start with a small example of backend code, just to get the gist of it, if you will write console.log in the backend , and use preview you should see the logs in the wix-code developer console.
then add a simple wix-fetch http call just to see you are able to make a simple example, i recommend you use this free service to see you can modify your request data, headers etc, and continue from there
good luck!
Shlomi
Hello Schlomi,
I (small) step forward – I followed your advise:
Google.jsw->
//google.jsw
import {fetch} from ‘wix-fetch’;
export function googleService() {
const url = “https://www.googleapis.com/calendar/v3/calendars/calendarId/events”;
//const url = “https://www.googleapis.com/auth/calendar”;
//const url = “https://requestb.in/191gz651”;
return fetch(url)
.then(response => console.log(response.json()));
}
In the main page →
import {googleService} from ‘backend/google’;
googleService();
In the log:
Promise { _c: , _a: undefined, _s: 0, _d: false, _v: undefined, _h: 0, _n: false }
I guess this because I did not find the way to provide the authorization parameters…
1 - Where can I find the way to send to google my output parameters ?
2 – Which url should I provide ? directly the “https://www.googleapis.com/calendar/v3/calendars/calendarId/events” ?
Or the “https://www.googleapis.com/auth/calendar”?
Thanks in advance for your helps
Pierre-yves
Hi
in the sendgrid example above, please note the capability to set headers and request parameters:
//sendGrid.js import {fetch} from 'wix-fetch';
export function sendWithService(key, sender, recipient, subject, body) {
const url = "https://api.sendgrid.com/api/mail.send.json";
const headers = { "Authorization": "Bearer " + key, "Content-Type": "application/x-www-form-urlencoded" };
const data = `from=${sender}&to=${recipient}&subject=${subject}&text=${body}`;
const request = { "method": "post", "headers": headers, "body": data };
return fetch(url, request) .then(response => response.json());
}
then send the needed parameters from the user browser in javascript to the backend method.
i am not familiar with google api but i can have a look later today or tomorrow
Shlomi
hi again,
I tried lot of different setup but I always get the same error:
Promise { _c: , _a: undefined, _s: 0, _d: false, _v: undefined, _h: 0, _n: false }
If you can take a look, that would be very useful…
Many thanks for your help.
Regards,
Pierre-yves
My lat try was:
const headers = {
“apiKey”: apikey,
“clientId”: clientid,
“scope”: ‘https://www.googleapis.com/auth/drive.metadata.readonly’,
“discoveryDocs”: [‘https://www.googleapis.com/discovery/v1/apis/drive/v3/rest’]
};
const request = {
“method”: “post”,
“headers”: headers
};
Hi pym,
you’ll need to use Using OAuth 2.0 to Access Google APIs | Authorization | Google for Developers for authentication. if you do not have experience with that, you’ll have to read and play around with it a little. this is the google authentication requirement
Shlomi
Hi pym,
I am faced with the same issue… I have been able ro do construct the data with id, description etc. But I inserting the json is an issue.
Can you help me about insertion, update and delete?
export function sendWithService(id,adisoyadi, lokasyon, start, end, not) {
const url = “https://api.sendgrid.com/api/mail.send.json”;
const headers = {
“apiKey”: apikey,
“clientId”: clientId,
“scope”: ‘https://www.googleapis.com/auth/calendar’,
“discoveryDocs”: [‘https://www.googleapis.com/discovery/v1/apis/drive/v3/rest’]
};
const data = ‘id :’ +id + ‘,Description:’ + adisoyadi + ‘, Location:’+lokasyon+’ ,Start: ’ + start +‘,End: ’ + end+’}';
//DateTime: “2015-05-28T09:00:00-07:00”,
const request = {
“method”: “post”,
“headers”: heade4rs,
“body”: data
};
return fetch(url, request)
.then(response => response.json());
}
Hello, I am facing with the same issue. I tried the things you shared and I was unable to do. Can you help me?
You may want to check node-google-calendar npm-module. I’m working my way through it - looks promising, early days though !
Hey guys,
Here is a working example of How to integrate Google Calendar API directly with Corvid: https://www.wix.com/corvid/forum/community-discussion/tutorial-google-calendar-api-create-event-in-your-google-calendar-with-corvid