Tôi đang cố gắng thêm bản đồ Google (tập lệnh được tải bên ngoài) vào ứng dụng Meteor nhưng không thành công và tôi nhận thấy hai loại vấn đề:

1. Nếu tôi làm điều đơn giản và thêm tập lệnh API chính vào <đầu> , sau đó nó được hiển thị nhưcuối cùng.
2. Khi điều này xảy ra, tôi phải <đầu> Chèn bất kỳphụ thuộc Viết kịch bản cho API. - Sau tập lệnh API chính. (Nếu không, tập lệnh sẽ nhắc họ rằng họ không thể thấy API blabla..)
3. Sau đó, đã đến lúc thực sự gọi hàm - bây giờ hãy đưa nó vào<đầu>Phần còn lại thì không tốt. Bạn cần sử dụng Template.MyTemplate.rendered.

Về cơ bản, câu hỏi của tôi là:

• Cách sạch nhất để xử lý vấn đề này là gì?
• Có biến/phương pháp nào khác mà tôi có thể sử dụng để đảm bảo tệp Google API chính của tôi được gọi đầu tiên trong HTML không?

1 Câu trả lời

Tôi vừa nhìn thấy bầu không khí ( https://atmosphere.meteor.com ) điều đó có thể giúp ích. Nó được gọi là session-extras và định nghĩa một số hàm mà tôi sử dụng để hỗ trợ tích hợp các tập lệnh bên ngoài. Đây là mã:https://github.com/belisarius222/meteor-session-extras

Ý tưởng cơ bản là tải một tập lệnh không đồng bộ, sau đó đặt biến Phiên trong lệnh gọi lại khi tập lệnh được tải. Tôi đã sử dụng các hàm từ gói session-extras để cố gắng làm cho quá trình này diễn ra suôn sẻ hơn một chút. Tôi có một số chức năng có 3 hoặc 4 phụ thuộc khác nhau (script và đăng ký), vì vậy mọi thứ bắt đầu trở nên phức tạp...

Tôi đoán tôi nên nói thêm rằng bạn có thể kết xuất mẫu theo điều kiện dựa trên việc tất cả các phụ thuộc của nó có tồn tại hay không. Vì vậy, nếu bạn có một nút Facebook, ví dụ, với một trình trợ giúp kiểm tra biến phiên, bạn có thể cung cấp cho nó một lớp css "disabled" và hiển thị "Loading facebook..." cho đến khi tất cả các tập lệnh cần thiết được tải xong.

Sửa đổi 03/14/2013

Có một cách tiếp cận hoàn toàn khác có hiệu quả trong nhiều tình huống: tự tạo gói của riêng bạn. Thiên thạch hiện tại có thể làm được điều này (hướng dẫn) và chức năng này sẽ sớm có mặt trên Meteor. Sau đây là một số ví dụ về cách tiếp cận này:

• jquery-đánh-giá-nó: https://github.com/dandv/meteor-jquery-rateit
• Bảng hỗn hợp thiên thạch:https://github.com/belisarius222/meteor-mixpanel

Nếu bạn đặt file js vào gói của mình, nó sẽ được tải trước mã ứng dụng, đây thường là cách tốt để đưa thư viện vào. Một lợi thế khác của việc tạo một gói là các gói có thể khai báo các phụ thuộc lẫn nhau, vì vậy nếu tập lệnh đang đề cập là, ví dụ, một plugin jQuery, bạn có thể khai báo nó trong gói gói.js Chỉ định rằng gói phụ thuộc vào jQuery trong tệp sẽ đảm bảo thứ tự tải chính xác.

Đôi khi nó trở nên thú vị hơn (theo nghĩa chửi thề của Trung Quốc) vì nhiều dịch vụ bên ngoài, bao gồm mixpanel và filepicker.io, có quy trình tải gồm hai phần: 1) một đoạn mã JS được đưa vào phần nội dung và 2) đoạn mã đó được tải không đồng bộ từ một tập lệnh lớn hơn trên CDN. Đoạn mã js thường (nhưng không phải lúc nào cũng vậy!) cung cấp một số phương thức trước khi tập lệnh lớn hơn được tải, để bạn có thể gọi các hàm của nó mà không cần phải thiết lập thêm logic để xác định trạng thái tải của nó. Mixpanel thực hiện điều này, mặc dù điều quan trọng cần nhớ là một số đoạn mã JS từ các dịch vụ bên ngoài yêu cầu bạn đặt khóa API vào cuối đoạn mã, trước khi tập lệnh lớn hơn tải; trong một số trường hợp, thư viện sẽ không hoạt động bình thường nếu tập lệnh được tải trước khi đặt khóa API. Xem gói meteor-mixpanel để biết ví dụ về giải pháp thay thế.

Bạn có thể tự tải xuống tệp js lớn hơn từ CDN và dán vào ứng dụng của mình; tuy nhiên, có những lý do chính đáng để không làm như vậy: 1) mã được lưu trữ có thể thay đổi và trừ khi bạn kiểm tra thường xuyên, mã của bạn có thể trở nên lỗi thời và bắt đầu sử dụng phiên bản API cũ hơn 2) các thư viện này thường đã được tối ưu hóa để tải các đoạn mã nhanh chóng theo cách không làm tăng đáng kể thời gian tải trang. Nếu bạn đưa một tệp JS lớn hơn vào ứng dụng của mình, thì máy chủ của bạn phải phục vụ tệp đó chứ không phải CDN và CDN sẽ phục vụ tệp đó khi tải trang ban đầu.

Liên quan đến javascript - Nắm vững thứ tự tải tập lệnh bên ngoài trong Meteor (Google Maps), chúng tôi đã tìm thấy một câu hỏi tương tự trên Stack Overflow: https://stackoverflow.com/questions/15233942/