I am working with Meteor.js. I need place photos of google place. I am working with Javascript here. So here is what I've done.
Meteor.call('getPlaceDetails', result.place_id, function (error, placeDetailsResult) {
if (error) {
console.log(error);
} else {
console.log(placeDetailsResult.data.result.photos[0].photo_reference);
Meteor.call('getPlacePhotos', placeDetailsResult.data.result.photos[0].photo_reference, function (error, photoresult) {
if (error) {
console.log(error);
} else {
console.log(photoresult);
}
});
}
});
I successfully got place_id from Place Details API call. With place_id I can then again successfully call the Place Photos API. I think all goes well here. In response I should get the photo and this is my responded JSON object:
Object {statusCode: 200, content: "����JFIF��*ExifII*1…!�o~Ç����`��&]<sP�\U��TV-���##�{��8�#7��*�"���", headers: Object, data: null}
content
:
"����JFIF��*ExifII*1Google���↵ ↵↵↵↵↵
data
:
null
headers
:
Object
access-control-allow-origin
:
"*"
access-control-expose-headers
:
"Content-Length"
alt-svc
:
"quic=":443"; ma=2592000; v="36,35,34,33,32,31,30""
alternate-protocol
:
"443:quic"
cache-control
:
"public, max-age=86400, no-transform"
connection
:
"close"
content-disposition
:
"inline;filename="2015-11-13.jpg""
content-length
:
"38587"
content-type
:
"image/jpeg"
date
:
"Thu, 01 Sep 2016 12:12:47 GMT"
etag
:
""v21fad""
expires
:
"Fri, 02 Sep 2016 12:12:47 GMT"
server
:
"fife"
vary
:
"Origin"
x-content-type-options
:
"nosniff"
x-xss-protection
:
"1; mode=block"
__proto__
:
Object
statusCode
:
200
__proto__
:
Object
In the documentation here: https://developers.google.com/places/web-service/photos they say you get a photo in return. So everything is fine, but I don't know how to display this photo on my website according there is no url. Please provide some usefull info.
Thanks :)
I did miss that function of what Sorin Lascu has commented. If someone is doing that in Meteor.js I will provide a complete and easy answer. I created an input field which has Google Maps API autocomplete, and shows the place on a map instantly. You also get all the necessary data you need to show to photos and other details.
I added this package jeremy:geocomplete to my project.
I created a map in HTML like this:
<div class="col s12 m10 l10 push-m1 push-l1" id="google_mapPlace">
{{> googleMap name="mapPlace" options=mapOptions}}
</div>
I added an input field in HTML
<input value="" type="text" class="findPlace">
Then in my js file I update my function with autorun.
Template.adminCollections.onRendered(function() {
this.autorun(function () {
if (GoogleMaps.loaded()) {
$(".findPlace").geocomplete({
map: "#google_mapPlace",
nearbySearchKeys: ['photos', 'place_id', 'name', 'geometry']
}).bind("geocode:result", function(event, result){
$('.myimg').attr('src', result.photos[0].getUrl({'maxWidth': 500, 'maxHeight': 500}));
});
});
});
});
Related
This question already has an answer here:
Google Maps API: No 'Access-Control-Allow-Origin' header is present on the requested resource
(1 answer)
Closed 3 years ago.
I'm trying to calculate the estimated travel time between two places, with the Google Maps API. I am asking for the data in the following way:
const Url = 'https://maps.googleapis.com/maps/api/distancematrix/json?origins=25.7694708,-80.259947&destinations=25.768915,-80.254659&key=' + API_KEY;
try {
const response = await fetch(Url);
console.log(response);
const data = await response.json();
console.log(data.rows);
} catch(e){
console.log(e);
}
The problem is that in the browser console I get the error:
TypeError: NetworkError when attempting to fetch resource
and it also shows me a warning:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://maps.googleapis.com/maps/api/distancematrix/json?origins=25.7694708,-80.259947&destinations=25.768915,-80.254659&key=API_KEY. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
But when I look at the console in the network part it shows me that the call was completed successfully and it shows me the following json:
{
"destination_addresses" : [ "3670 SW 3rd St, Miami, FL 33135, USA" ],
"origin_addresses" : [ "3911 SW 2nd Terrace, Coral Gables, FL 33134, USA" ],
"rows" : [
{
"elements" : [
{
"distance" : {
"text" : "0.9 km",
"value" : 881
},
"duration" : {
"text" : "2 mins",
"value" : 144
},
"status" : "OK"
}
]
}
],
"status" : "OK"
}
Can someone help me solve this problem? I have tried similar questions on the site but I have not been able to solve the problem. Thanks in advance.
You are using Distance Matrix Service on client side.
But the manner you trying to access the API is not supported for client(browser)-site and it will not work reliably.
Good that there is a library for your use-case:
Here's the guide for the Distance Matrix Service on client side. And here's a vanilla-js example Check it out.
Maybe this snippet will help you:
const matrix = new google.maps.DistanceMatrixService();
matrix.getDistanceMatrix({
origins: [new google.maps.LatLng(25.7694708, -80.259947)],
destinations: [new google.maps.LatLng(25.768915, -80.254659)],
travelMode: google.maps.TravelMode.DRIVING,
}, function(response, status) {
//do something
});
I've have tried to scan a table and filter it by its secondary key, which is Number named Group. If I applied this sacn at Amazon Web Console, the result is simple and right:
But using JavaScript I only got an empty result. Here is the JS code:
var id;
console.log("scan products")
// Get the id from the pathParams
id = request.pathParams.id;
console.log(id)
var params = {
TableName: request.env.tableName,
FilterExpression: '#product_group = :this_group',
ExpressionAttributeValues : {':this_group': {N:id}},
ExpressionAttributeNames: {'#product_group':'group'}
};
console.log("aqui")
console.log(params.ExpressionAttributeValues)
// post-process dynamo result before returning
return dynamo.scan(params).promise().then(function (response) {
return response;
});
Here you can see my result output:
2018-01-04T16:53:38.223Z ce022431-f16f-11e7-8a90-4f25e3228700 { headers:
{ 'content-type': 'application/json',
'content-length': '40',
connection: 'close',
date: 'Thu, 04 Jan 2018 16:53:38 GMT',
'x-amzn-requestid': 'ce6663b2-f16f-11e7-913f-c1a766cd30ad',
'access-control-allow-origin': '*',
'access-control-allow-headers': 'Content-Type,Authorization,X-Amz-Date,X-Api-Key,X-Amz-Security-Token',
'access-control-allow-methods': 'GET,OPTIONS',
'x-amzn-trace-id': 'sampled=0;root=1-5a4e5c10-f5dbe9d3ad72eb4f1f5bdc12',
'access-control-max-age': '0',
'access-control-allow-credentials': 'true',
'x-cache': 'Miss from cloudfront',
via: '1.1 aa9a6b87feabe1a30d21428a24c1a7d8.cloudfront.net (CloudFront)',
'x-amz-cf-id': 'AvS-yi8Y_-b6nwyYNosEGxpvpBkMptFigjldwZmO3ros6kO8JdBZhQ==' },
body: '{"Items":[],"Count":0,"ScannedCount":14}',
statusCode: 200,
statusMessage: 'OK' }
I don't know what I'm possible doing wrong since it is a really simple scan.
Please scan until the LastEvaluatedKey is null to go through all the items in the Dynamodb table. The single scan will go through only 1 MB of data.
Please execute the scan until LastEvaluatedKey is null.
A single Scan operation will read up to the maximum number of items
set (if using the Limit parameter) or a maximum of 1 MB of data and
then apply any filtering to the results using FilterExpression. If
LastEvaluatedKey is present in the response, you will need to paginate
the result set.
API Scan
Scan table - sample code
Note the below code:-
The scan should be executed until LastEvaluatedKey is undefined or null.
if (typeof data.LastEvaluatedKey != "undefined") {
console.log("Scanning for more...");
params.ExclusiveStartKey = data.LastEvaluatedKey;
docClient.scan(params, onScan);
}
I am trying to POST the below json using the Microsoft Dynamics WebAPI. The post returns a success, but in my data the ccseq_employeeid and ccseq_clientid are not set. What do I need to change to get the fields to post correctly?
Entity Structure
ccseq_expensetransaction has a lookup to ccseq_expensetransactionsets with a relationship that has the name ccseq_ccseq_expensetransactionset_ccseq_expensetransaction_ExpenseTransactionSetID. The lookups to systemusers and ccseq_clients are a part of the ccseq_expensetransaction entity.
Code
POST /api/data/v8.0/ccseq_expensetransactionsets HTTP/1.1
Host: url.com
Content-Type: application/json
Cache-Control: no-cache
Postman-Token: 24f7ead3-0307-996f-f45a-f959c604c922
{
"ccseq_importdate":"2017-06-05T04:00:00Z",
"ccseq_month":"1",
"ccseq_year":"2017",
"ccseq_name":"Test 30",
"ccseq_status":"100000000",
"ccseq_ccseq_expensetransactionset_ccseq_expensetransaction_ExpenseTransactionSetID":[
{
"ExpenseTransaction[ccseq_employeeid#odata.bind]":"/systemusers(6d2fd71b-32d1-dd11-a4f5-001a6449bbe7)",
"ExpenseTransaction[ccseq_clientid#odata.bind]":"/ccseq_clients(663ebd00-73b9-4faf-90ed-f56bb9c2dc9b)"
}
]
}
Modify the body of the request into this:
{
"ccseq_importdate": "2017-06-05T04:00:00Z",
"ccseq_month": "1",
"ccseq_year": "2017",
"ccseq_name": "Test 30",
"ccseq_status": "100000000",
"ccseq_employeeid#odata.bind": "/systemusers(6d2fd71b-32d1-dd11-a4f5-001a6449bbe7)",
"ccseq_clientid#odata.bind": "/ccseq_clients(663ebd00-73b9-4faf-90ed-f56bb9c2dc9b)"
}
The data is being passed to the replyMessage as the console log is showing the correct data, however, the API isn't receiving this data. Input is empty?
replyMessage: function(data) {
console.log(data);
return $http.patch('/api/email/inbox/0', data);
}
Can you see any issues with this or any things to look at?
Are you formatting patch correctly?
It needs to be a JSON.stringify(data) Array.
With data being formatted like so:
[
{
"op" : "replace",
"path" : "/Name", // <-- this is what field you're editing
"value" : "John Doe"
}
]
Also you might need your contentType to be application/json-patch+json;
I want to receive a JSON object using Ruby. I've written this:
require 'sinatra'
require 'json'
post '/' do
push = JSON.parse(params[:payload])
"I got some JSON: #{push.inspect}"
end
And I'm sending:
var options = {
host: 'localhost',
port: 4567,
path: '/',
method: 'POST'
};
var myFirstJSON = { "payload" : { "headers" :
[{ "from" : from,
"to" : to,
"subject" : subject }],
"body" :
[{ "primeira_parte" : primeira_parte,
"segunda_parte" : segunda_parte,
"terceira_parte": terceira_parte }]
}};
req.write(JSON.stringify(myFirstJSON));
However, I'm getting this error:
TypeError - can't convert nil into String:
{"{\"payload\":{\"headers\":"=>{"{\"from\":\"test#test.com\",\"to\":\"test#test.com\",\"subject\":\"Testing\"}"=>{",\"body\":"=>{"{\"primeira_parte\":\"The following message to <test#test.com> was undeliverable.\\r\\nThe reason for the problem:\\r\\n5.1.0 - Unknown address error 553-'sorry, this recipient is not in my valid"=>"\\r\\nrcptto list (#5.7.1)'\",\"segunda_parte\":\"Final-Recipient: rfc822"}}}, "test#test.com\\r\\nAction: failed\\r\\nStatus: 5.0.0 (permanent failure)\\r\\nRemote-MTA: dns"=>nil, "216.75.35.163"=>{"\\r\\nDiagnostic-Code: smtp"=>nil}, "5.1.0 - Unknown address error 553-'sorry, this recipient is not in my validrcptto list (#5.7.1)' (delivery attempts: 0)\",\"terceira_parte\":\"Received: from unknown (HELO aws-bacon-delivery-svc-iad-1020.vdc.amazon.com) ("=>{"10.144.21.123"=>{")\\r\\n by na-mm-outgoing-6102-bacon.iad6.amazon.com with ESMTP"=>nil}}, "16 Apr 2011 14:11:15 0000\\r\\nReturn-Path: 0000012f5eb1cab3-09564031-57ef-4136-8cd7-9f368c5acd7d-000000#email-bounces.amazonses.com\\r\\nDate: Sat, 16 Apr 2011 14:23:20 0000\\r\\nFrom: tiago#tiagop.org\\r\\nTo: test#test.com\\r\\nMessage-ID: <0000012f5eb1cab3-09564031-57ef-4136-8cd7-9f368c5acd7d-000000#email.amazonses.com>\\r\\nSubject: Testing\\r\\nMime-Version: 1.0\\r\\nContent-Type: text/plain"=>nil, "\\r\\n charset"=>"UTF-8\\r\\nContent-Transfer-Encoding: 7bit\\r\\nX-AWS-Outgoing: 199.255.192.79\\r\\n\\r\\n<html><body><p> Helllooo </p></body></html>\\r\\n\\r\\n\"}]}}"}
What you want is a route like this:
post '/' do
push = JSON.parse(request.body.read)
"I got JSON: #{push.inspect}"
end
You're not form encoding the data, therefore it doesn't get set in params.