To give unsubscribe link in the mail using sendgrid XSMTPAPI header - jakarta-mail

Can any one please tell me how to add unsubscribe link in the mail which is send by modifying the header.I am using Sendgrid header XSMTPAPI, although I found a relevant header called subscription track in the filters, but couldn't figure out how to use it.

You would want to have an X-SMTPAPI header that looked something like this when broken out:
{
filters: {
subscriptiontrack: {
settings: {
enable: 1,
"text/html": "Unsubscribe <%Here%>",
"text/plain": "Unsubscribe Here: <% %>"
}
}
}
}
When you're sending the request, make sure you stringify the JSON for the header:
X-SMTPAPI: '{"filters":{"subscriptiontrack":{"settings":{"enable":1,"text/html":"Unsubscribe <%Here%>","text/plain":"Unsubscribe Here: <% %>"}}}}'
Also, as a side note, all of this can be found on the docs page for the X-SMTPAPI header:
http://sendgrid.com/docs/API_Reference/SMTP_API/index.html
http://sendgrid.com/docs/API_Reference/SMTP_API/apps.html

Related

Unable to set up invisible reCAPTCHA verifier for multi-factor authentication in a react app

As per this article, https://cloud.google.com/identity-platform/docs/web/mfa, I am trying to set up invisible reCAPTCHA. However, the callback function does not seem to fire. The idea is that I want the recaptcha to fire off upon a button click and send a code via the callback function but it is not working.
I am trying to activate the recaptcha via the following function linked to a button with the 'code-button" id.
sendCode () {
const recaptchaVerifier = new firebase.auth.RecaptchaVerifier('code-button', {
'size': 'invisible',
'callback': () => {
// reCAPTCHA solved, you can proceed with phoneAuthProvider.verifyPhoneNumber(...).
// onSolvedRecaptcha();
console.log("captcha is working")
}
})
recaptchaVerifier.render()
}
When I press the button to fire off the sendCode function, the callback inside the recaptchaVerifier does not seem to work. It is supposed to console.log "captcha working" but it does not as I check the console.
I do get the following issues in the console but I am not sure if they are actually blocking the callback or making the recaptcha not work:
Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute
SharedArrayBuffer usage is restricted to cross-origin isolated sites
I do not even know how to resolve them. As per some articles, they seem to be issues that can only be resolved by Google itself.
Does anyone know why this is happening?
Thanks.
I solved this issue myself by dropping the callback from within and instead I simply called recaptchaVerifier from another function as needed. For example:
First, initialize the recaptcha and render it:
const recaptchaVerifier = new firebase.auth.RecaptchaVerifier('code-button', {
size: 'invisible'
});
recaptchaVerifier.render()
Then, simply call it where needed:
user.multiFactor.getSession().then((multiFactorSession) => {
// Specify the phone number and pass the MFA session.
const phoneInfoOptions = {
phoneNumber: this.state.number,
session: multiFactorSession
};
const phoneAuthProvider = new firebase.auth.PhoneAuthProvider();
// Send SMS verification code.
return phoneAuthProvider.verifyPhoneNumber(
phoneInfoOptions, recaptchaVerifier);
})

CORS header ‘Access-Control-Allow-Origin’ missing - Access-Control-Allow-Origin already given

i have already given the header for axios call but i am still getting this error. i have tried a lot.
the code is given below: -
class Test extends React.Component {
constructor(props) {
super(props);
this.state = { address: '' };
}
componentDidMount(){
axios({type:'get',url:'https://maps.googleapis.com/maps/api/place/nearbysearch/json?location=Chennaiined&radius=1000&keyword=fdtbf&key=KEY'},{header:{'Access-Control-Allow-Origin': 'https://maps.googleapis.com'}})
.then(res=> alert("response"+res))
}
render() {
return (
<div>
<span>test</span>
</div>
);
}
}
i have given * instead of https://maps.googleapis.com but still getting the same error.
Thanks in advance
As far as I know, you have to use Google Maps' Place API, not Axios.
Example:
var request = {
query: 'Museum of Contemporary Art Australia',
fields: ['photos', 'formatted_address', 'name', 'rating',
'opening_hours', 'geometry'],
};
service = new google.maps.places.PlacesService(map);
service.findPlaceFromQuery(request, callback);
As #sideshowbarker said:
Using the Maps JavaScript API like that—by way of a script element to load the library, and then using the google.maps.Map and other google.maps.* methods—is the only supported way to make requests to the Google Maps API from frontend JavaScript code running a browser.
Google intentionally doesn’t allow access to the Google Maps API by way of requests sent with axios or AJAX methods in other such libraries, nor directly with XHR or the Fetch API.
You could find more information here: https://developers.google.com/maps/documentation/javascript/places#place_search_requests
Also, there are already duplicate questions: CORS and Angular $http GET to Google Places API
and Google Maps API: No 'Access-Control-Allow-Origin' header is present on the requested resource

Reactjs Api Call Not working in Yii2

I'm new to React js And I using Yii2 as my backend..! When I Send a API request to yii2 ,It Returns me the 500 Error.I don't know,Where I made a mistake.
Here is my React Js Code for API call,
fetch('localhost/learning-react/api/admin/signup', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
body: JSON.stringify({
fname:fname,
lname:lname,
email:email,
uname:uname,
passwd:passwd
})
}).then((response) => response.json())
.then((responseJson) => {
if(responseJson['status']==='1')
{
alert(responseJson['msg']);
}
}
And This is My Yii2 Backend code,
public function actionSignup()
{
//$model = new TblUsers();
return "success";
}
Sorry For my Inability to finding mistakes in my code..!
First of all, 500 means generic server error. So you will need to post your error log as per my comment to help on that. However, I have found your code on the backend is wrong. You do not user restful controller in your code and as such it is not a REST API at all. So I advice you to read through Restful APIs in the Guide. That being said, you basically need to:
Create Restful controller by inheriting from yii\rest\Controller.
Return either Array, DataProvider or instance of yii\base\Model to have guarantee of automated serialization to JSON
so I will show you a simple example to give you an idea. Please read the guide to get in-depth insights on REST API with Yii2.
<?php
namespace app\modules\v1\controllers;
use yii\rest\Controller;
class LoginController extends Controller
{
public function actionSignup()
{
$model = new TblUsers();
//register a user
//return registred user
return [
'success' => true,
'member' => $model;
];
}
}
Let try the following, it may help.
You are making a rest post request, this means two things, first info will travel by POST request, and second dont forget its rest.
try opening the url in the browser, unless you define a rule it should open.
So go ahead open: http://localhost/learning-react/api/admin/signup you should see a "success" on the screen, or you will se the full 500 error printed.
If you were able to open the url on the browser, try the call again, and check your chrome debugger on the network tab. Look for the 500 error open it and read the error, it should be fully printed there on the response tab i.e.
when this is solved, don't forget to enable rules to allow only POST as request, and add the appropriate format for the response so you can consume it as json.
Yii::$app->response->format = Response::FORMAT_JSON;
Hope it helps debuggin.

Google Calendar API. Patching sharedExtendedProperty for events

I have created event in my Google calendar. Most interesting part is:
{
// some event data;
"extendedProperties": {
"shared": {
"cases_1": "1",
"cases_2": "2"
}
}
}
Right now I need to PATCH existing event. In extendedProperties I do not need "cases_1":"1" any more. So I use developers endpoint to patch it. The PATCH request body is:
{
"extendedProperties": {
"shared": {
"cases_2": "2"
}
}
}
In response I see my both shared fields. How must my request body look like to remove from extendedProperties shared cases_1 field?
Try adding the line below to your request:
{
"extendedProperties": {
"shared": {
"cases_1": null,
"cases_2": "2"
}
}
}
It was shown in this documentation:
Any properties not included in an update request will be deleted, but
a better approach is to make a patch request to set the value to null
Hope this helps.

Angular : show image from REST Service

After reseaches and tests, I still can't show an image form ReST API on my Angular App. I have images available on my ReST web service, why do I use a ReST service? Because in order to access you need to be authenticated (I use oAuth 2 protocol). When I use POSTMan (ReST client very usefull) everything works great, the image is displayed without doing nothing. But when I try to display it with Angular after a $http it doesn't work.
Here are the headers received form the service :
Content-Length → 51756
Content-Type → image/jpeg; charset=binary
Server → Apache/2.4.9 (Win64) PHP/5.5.12
X-Powered-By → PHP/5.5.12
Here is my Angular code :
var data64 = $base64.encode(unescape(encodeURIComponent(data)));
scope.src = 'data:image/jpeg;charset=binary;base64,' + data64;
and my HTML :
<img ng-src="{{src}}" border="0" />
For information I use angular-base64 (https://github.com/ninjatronic/angular-base64) for the encodage. Without "unescape" and "encodeURIComponent" I have an error, I've tried to remove white spaces but it still doesn't work.
Thank you :)
Seems that this will not work since you tell the browser that the image data is base64 encoded, but you also transformed it with unescape and encodeURIComponent.
Why don't you fetch your image data into a binary data structure (requires a modern browser), instead of into a string:
$http.get(req, {responseType: "arraybuffer"}).
success(function(data) {
$scope.src = 'data:image/jpeg;base64,' + _arrayBufferToBase64(data);
});
_arrayBufferToBase64 is defined here.
A different approach would be to install a request interceptor, recognize the image url and add the oauth headers for this case.
I tryed this way in angular 8+ and works fine:
imageToShow: any;
createImageFromBlob(image: Blob) {
let reader = new FileReader();
reader.addEventListener("load", () => {
this.imageToShow = reader.result;
}, false);
if (image) {
reader.readAsDataURL(image);
}
}
and also call it like this:
getImageFromService() {
this.api.getImage(key).subscribe(data => {
this.createImageFromBlob(data);
}, error => {
console.log(error);
});
}

Resources