Post request block open new tab
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/4.1.0/rx.all.js"></script>
<script src="https://unpkg.com/axios@0.16.1/dist/axios.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="button_test">Click Here</button>
CSS
.invisible {
visibility: hidden;
}
.button_test {
margin-left: 200px;
margin-top: 100px;
font-size: 50px;
}
Babel + JSX
// Reference:
// https://base62.io/
let message_encoded = 'T8dgcjRGkZ3aysdN'; // base62('Hello World!'')
let way = 1;
$(function () {
$('.button_test').click(async function() {
let url_api = 'https://api.base62.io/decode';
let response;
switch (way) {
case 1: /* this works */
response = await jQuerySyncPost(url_api, { data: message_encoded });
break;
case 2: /* this DOES NOT work */
response = await fetchSyncPost(url_api, { data: message_encoded });
break;
case 3: /* this DOES NOT work */
response = await axios.post(url_api, { data: message_encoded });
break;
}
alert('Next, let\'s look on Google for: "' + response.data.decoded + '"');
let message_decoded = response.data.decoded;
let url_google = 'https://www.google.com/search?q='+encodeURIComponent(message_decoded);
openNewTab(url_google);
});
});
function jQuerySyncPost(url, params) {
return new Promise((resolve, reject) => {
$.ajax({
type: 'POST',
url: url,
data: params,
async: false,
success: function (response) {
response = {
data: response
};
resolve(response);
},
error: function (jqXHR, textStatus, errorThrown) {
reject({
jqXHR: jqXHR,
textStatus: textStatus,
errorThrown: errorThrown
});
}
});
});
}
function fetchSyncPost(url, params) {
return new Promise((resolve, reject) => {
let config = {
headers: {
'content-type': 'application/json; charset=UTF-8',
},
body: JSON.stringify(params),
method: 'POST',
};
fetch(url, config)
.then(response => response.json())
.then(response => {
let result = {
data: response,
};
resolve(result);
})
;
});
}
function openNewTab(url) {
window.open(url, '_blank');
}