ExcelToApp: Add-in tạo WebApp từ Excel

[thuanfun]

Chào các bạn,

Hôm nay mình xin giới thiệu đến các bạn một excel add-in mới: “ExcelToApp”.

ExcelToApp là gì?

“Excel to App” nghĩa là biến Excel thành App, cụ thể ở đây là WebApp.

ExcelToApp là excel add-in giúp bạn tạo các WebApp từ chính file Excel của bạn một cách dễ dàng mà không cần có kiến thức lập trình Web.

ExcelToApp dùng để làm gì?

Về cơ bản ExcelToApp là một giải pháp chia sẻ vùng (Range) Excel lên Web. Bạn có thể xem, nhập liệu, chạy macro, … trực tiếp (real-time) vào file Excel ở trên máy tính của bạn từ Web.

ExcelToApp có thể sử dụng để nhập liệu vào file Excel của bạn từ xa, trên mọi thiết bị (điện thoại, máy tính bảng, máy tính) thông qua trình duyệt Web

ExcelToApp có thể sử dụng để xem các báo cáo Excel từ xa theo thời gian thực.

ExcelToApp giúp cho bạn bảo mật file Excel của bạn vì bạn chỉ cần chia sẻ những vùng (Range) mà bạn muốn.

Bạn cũng có thể tạo một WebApp tính toán những phép tính phức tạp bằng cách nhờ vào khả năng tính toán của Excel. Bạn chỉ cần nhập các tham số, Excel sẽ tính ra kết quả và hiển thì trên WebApp.

Các ứng dụng có thể viết trên Excel là vô hạn. ExcelToApp sẽ giúp bạn đưa ứng dụng Excel của bạn thành một ứng dụng Web.

Cài đặt

Bạn xem hướng dẫn cài đặt ở bài viết sau: ExcelToApp: Hướng dẫn cài đặt

 

[thuanfun]

Ví dụ tạo WebApp nhập liệu từ Web



Trong bài này, autoDN sẽ hướng dẫn các bạn làm một ví dụ nhỏ về việc tạo một WebApp đơn giản để nhập liệu vào file Excel của bạn.

Đầu tiên, các bạn tải file Excel mẫu e2a-demo-01.xlsm để thực hành đúng theo hướng dẫn.


Trong file Excel có 2 sheet, sheet đầu tiên là sheet DuLieu dùng để lưu danh sách khách hàng, số tiền, người nhập liệu, thời gian nhập.

Sheet thứ 2 là sheet NhapLieu có cấu trúc như một Form nhập liệu gồm 2 cell nhập Tên khách hàng, số tiền và một nút “Đồng ý” để thêm khách hàng vào sheet DuLieu. Nút “Đồng ý ” được liên kết mối một hàm Macro để ghi dữ liệu sang sheet DuLieu (xem trong file excel đính kèm phía trên).

File Excel này là một phần mềm Excel nhập liệu (khách hàng) đơn giản và hoạt động tốt trên Excel.

Bây giờ, autoDN sẽ hướng dẫn bạn sử dụng ExcelToApp để biến bảng nhập liệu này thành WebApp để bạn có thể nhập liệu từ xa thông qua trình duyệt Web.

Tạo WebApp mới

Bạn mở file Excel tải về ở trên. Trong Tab “Excel <=> App” bạn click nút “Tạo mới WebApp“.

Cửa sổ tạo mới WebApp hiện lên. Ở đây bạn điền App Id, tên App và chọn biểu tượng Icon (có sẵn rất nhiều Icon). Sau khi nhập các thông số bạn chọn “Tạo App mới”.

Cửa sổ thiết kế App hiện lên như hình dưới đây:

Trong ví dụ này, WebApp chỉ có 1 Form nhập liệu nên ta chỉ quan tâm đến “Nội dung trang chủ” (Các menu/Nav autoDN sẽ có bài hướng dẫn cụ thể sau).

Bạn click chọn nút “chọn vùng” (khoanh đỏ hình trên) và chọn khu vực nhập liệu:

(Di chuột chọn vùng và click nút ở đầu mũi tên để đồng ý)

(Nội dung trang chủ WebApp đã được chọn)


Sau khi đã khai báo nội dung trang chủ, bạn chuyển qua Tab “Xem trước & Xuất bản”.

Bạn click nút “Xuất bản App” để Upload App của bạn lên host autodn.app, sau đó bạn click nút “Mở URL bằng Web Browser” để chạy App của bạn trên trình duyệt Web.

Trước khi chạy WebApp trên trình duyệt, bạn cần thêm người dùng (user) và “Chạy Serser” trên Excel của bạn để làm WebServer.

(Click vào đây để thêm người dùng mới)

(Click nút “Chạy Server” để chạy WebServer)

(Nếu thấy nút “Dừng Server” như hình thì có nghĩa Server của bạn đang chạy)



Sau khi mở đường link WebApp của bạn, bạn thấy chữ “Server đã sẵn sàng!” như hình dưới có nghĩa là WebApp đã kết nối thành công đến File Excel của bạn. Tiếp theo bạn nhập User/pass mà bạn đã khai báo ở mục “Danh sách người dùng” và đăng nhập.

Sau khi đăng nhập thành công, bạn có thể nhập liệu cho 2 cell tên khách hàng, số tiền. Nội dung thay đổi sẽ truyền trực tiếp (real-time) đến file excel của bạn. Khi bạn click nút “Đồng ý” thì hàm Macro liên kết với nút “Đồng ý” cũng sẽ được gọi (và thực hiện việc thêm khách hàng vào sheet DuLieu).

Mặc định các cell hiện thị trên WebApp sẽ không cho phép sửa. Để cho phép sửa nội dung cell nào đó từ WebApp, bạn cần bỏ thuộc tính “Locked” của cell như hướng dẫn trong 2 hình sau:

(Mở Format Cells…)

(Sang Tab “Protection” và bỏ Tick Locked)


Như vậy, bạn đã hoàn thành xong một WebApp nhập liệu từ xa đơn giản.

Trong các bài viết tiếp theo, autoDN sẽ hướng dẫn các bạn tạo menu, link và hiển thị nhiều excel Range lên WebApp.

 

[thuanfun]

Mình vừa tổng hợp lại bài hướng dẫn dưới dạng video để các bạn dễ hình dung

 

[Huyyeu99999]

 

[MinhKhai]

Nó hay như vậy, lẽ nào miễn phí mãi bạn nhỉ ?

 

[thuanfun]

Nó hay như vậy, lẽ nào miễn phí mãi bạn nhỉ ?

Add-in này cần duy trì Server để truyền dữ liệu giữa Web và Excel nên sẽ có bản tính phí bên cạnh bản miễn phí.

Cách tính phí bên mình đang cập nhật, chủ yếu dựa vào lưu lượng băng thông sử dụng trên app của bạn. Với các app sử dụng ít băng thông (như ví dụ trên) sẽ miễn phí.

 

[thuanfun]

Video này hướng dẫn bạn cách tạo menu bên trái và phía trên cho WebApp từ file excel của bạn.

Dữ liệu tham khảo:
File excel demo: http://autodn.net/files/Excels/e2a-demo-02.xlsm
Font Awesome: https://www.w3schools.com/icons/fontawesome_icons_webapp.asp

 

[thuanfun]

Video hướng dẫn cài đặt:

 

[thukhon2014]

Bài viết hay như vậy không LIKE thì LIKE ai đây !

 

[thuanfun]

Hướng dẫn tạo giao diện WebApp cơ bản từ file Excel:



Các bạn xem Video hướng dẫn ở đây:

https://www.facebook.com/video.php?v=175220373899816

 

[thuyyeu99]

Hihi giờ read, write excel qua mạng không khó nữa rồi mình cũng nắm bắt được xíu. Mà cái app của bạn nhìn cũng hay thật

 

[thuanfun]

Hihi giờ read, write excel qua mạng không khó nữa rồi mình cũng nắm bắt được xíu. Mà cái app của bạn nhìn cũng hay thật

Cảm ơn bạn!
App này mình thiết kế theo kiểu "mì ăn liền". Người dùng không cần phải biết code, với vài click chọn là đã xây dựng xong một WebApp để có thể xem và nhập liệu trên Web (vào bằng điện thoại, máy tính bảng hay máy tính đều được).

 

[thuanfun]

Chào các bác,
Em với bổ sung tính nằng chạy Macro từ xa qua Internet vào Excel to App.

Giới thiệu API chia sẻ hàm Excel Macro qua Internet

API chia sẻ hàm Excel Macro trên add-in Excel to App là tính năng cho phép gọi hàm Macro trên file Excel của bạn từ mọi nền tảng/ngôn ngữ lập trình.

(API chia sẻ excel Macro có thể gọi từ mọi ngôn ngữ lập trình và mọi nền tảng)

Tính năng này giúp bạn chủ động thiết kế các ứng dụng để cập nhật dữ liệu từ xa hoặc thực thi các công việc bằng cách gọi hàm macro với các tham số.

Cấu trúc API như sau:

URL: https://excel.autodn.app/api/post?action=runMacro&serverId={serverId}&user={user}&pass={pass/token}&excelFileId={excelFileId}&macroName={macroName}
Method: POST
Header: Content-Type: application/x-www-form-urlencoded
Body: Các tham số của hàm macro cách nhau bởi ký tự "|". Ví dụ: "Nguyễn Văn An|Hà Nội|27"

Response: Nếu thành công bạn sẽ nhận được chuỗi String: Sending|{commandId}
Trong đó Sending nói rằng lệnh vẫn đang gửi; {comandId} là Id của lệnh POST này, được sử dụng để lấy kết quả của lệnh POST sau một vài giây (nếu cần)

Các tham số trong URL:

• serverId: mỗi máy tính cài add-in Excel to App được gán 1 serverId cố định duy nhất
• user: chính là username mà bạn tự thêm/sửa trên add-in
• pass/token: là mật khẩu của user
• excelFileId: là Id của file excel mà bạn chia sẻ macro. Mỗi file Excel khi chia sẻ sẽ được gắn 1 id gồm 6 ký tự.
• macroName: là tên hàm macro trong file Excel của bạn.

Các bài hướng dẫn chi tiết:

• Cách xác định các tham số kết nối dùng trong API
• Code hàm RunMacroInServer phía Client
• Hướng dẫn chia sẻ hàm Excel Macro qua Internet
• Ví dụ sử dụng API gọi hàm Macro qua Internet

 

[huyyeu99]

Mình hỏi chúc nhé. Clients chay macro trên server làm gì ?

 

[thuanfun]

Hướng dẫn chia sẻ hàm Excel Macro qua Internet

Mình hỏi chúc nhé. Clients chay macro trên server làm gì ?

Chào bạn,
Server-Client là mô hình giao tiếp giữa 2 máy tính trong đó 1 máy được gọi là Server (máy chủ) và một (hoặc nhiều) máy gọi là Client (máy khách).

Trong add-in "Excel to App", Server là một máy tính bất kỳ có cài add-in "Excel to App" và chia sẻ WebApp hoặc API chạy Macro từ xa. Các User khác kết nối từ Web hoặc từ excel trên máy tính khác gọi là các Client.

Vậy Server ở đây có thể hiểu đơn giản là: Bạn chia sẻ file Excel để cho người khác cập nhật dữ liệu từ máy tính khác.

Bài đã được tự động gộp: 27/2/20

Chạy Macro trên server có thể làm được việc gì?

Câu hỏi này tương đương với câu hỏi Macro làm được việc gì? Câu trả lời là rất nhiều việc.

Về bản chất API này là một lệnh http POST nên bạn có thể gọi Macro từ mọi nền tảng/ngôn ngữ lập trình. Có nghĩa, bạn có thể gọi Macro từ VBA (excel, word, ...), web (JavaScript, PHP, ...), C/C++ (các phần mềm trong vi mạch điện tử), ...

Bạn tham khảo code RunMacroInServer ở đây: Code hàm RunMacroInServer phía Client

Ví dụ, bạn có file excel, trong đó có hàm macro để thêm khách hàng vào sheet danh sách khách hàng như sau:

ThemKhachHang(HoTen, DienThoai, Email, DiaChi)

Thông thường, bạn chỉ có thể sử dụng hàm macro này trên chính máy tính của bạn. API chia sẻ Macro qua Internet cho phép chạy hàm Macro này từ máy tính khác.

 

[huyyeu99]

Hướng dẫn chia sẻ hàm Excel Macro qua Internet


Chào bạn,
Server-Client là mô hình giao tiếp giữa 2 máy tính trong đó 1 máy được gọi là Server (máy chủ) và một (hoặc nhiều) máy gọi là Client (máy khách).

Trong add-in "Excel to App", Server là một máy tính bất kỳ có cài add-in "Excel to App" và chia sẻ WebApp hoặc API chạy Macro từ xa. Các User khác kết nối từ Web hoặc từ excel trên máy tính khác gọi là các Client.

Vậy Server ở đây có thể hiểu đơn giản là: Bạn chia sẻ file Excel để cho người khác cập nhật dữ liệu từ máy tính khác.

Bài đã được tự động gộp: 27/2/20

Chạy Macro trên server có thể làm được việc gì?

Câu hỏi này tương đương với câu hỏi Macro làm được việc gì? Câu trả lời là rất nhiều việc.

Về bản chất API này là một lệnh http POST nên bạn có thể gọi Macro từ mọi nền tảng/ngôn ngữ lập trình. Có nghĩa, bạn có thể gọi Macro từ VBA (excel, word, ...), web (JavaScript, PHP, ...), C/C++ (các phần mềm trong vi mạch điện tử), ...

Ví dụ, bạn có file excel, trong đó có hàm macro để thêm khách hàng vào sheet danh sách khách hàng như sau:

ThemKhachHang(HoTen, DienThoai, Email, DiaChi)

Thông thường, bạn chỉ có thể sử dụng hàm macro này trên chính máy tính của bạn. API chia sẻ Macro qua Internet cho phép chạy hàm Macro này từ máy tính khác.

không ý mình hỏi là client chạy Macro trên Sever để làm gì áy

Àh

 

[thuanfun]

không ý mình hỏi là client chạy Macro trên Sever để làm gì áy

Ứng dụng hay dùng nhất là để cập nhật dữ liệu vào file Excel từ xa bạn nhé!

 

[befaint]

không ý mình hỏi là client chạy Macro trên Sever để làm gì áy

Để làm những gì mình thích
- Nhập dữ liệu, thực thi cái mình muốn
- Lấy phản hồi mong muốn từ các lệnh được gửi đi (nếu API có trả kết quả ngược lại).
Cái trọng tâm là có API thì sẽ dùng được ở nhiều môi trường, ngôn ngữ khác nhau rất thuận tiện.

 

[huyyeu99]

Àh mình biêt rồi

Bài đã được tự động gộp: 27/2/20

Để làm những gì mình thích
- Nhập dữ liệu, thực thi cái mình muốn
- Lấy phản hồi mong muốn từ các lệnh được gửi đi (nếu API có trả kết quả ngược lại).
Cái trọng tâm là có API thì sẽ dùng được ở nhiều môi trường, ngôn ngữ khác nhau rất thuận tiện.

Vậy thì dễ quá chiều rảnh minh lam cái Demo cho coi

 

[thuanfun]

Lấy phản hồi mong muốn từ các lệnh được gửi đi (nếu API có trả kết quả ngược lại).

API này real-time chiều gửi đi (tức là client đẩy lên thì Server nhận được luôn). Chiều ngược lại thì cần gửi thêm Request để lấy kết quả (nếu cần lấy kết quả).

- Sau khi gửi lệnh chạy Macro thì kết quả lệnh POST trả về chuỗi "Sending|{commandId}", trong đó {commandId} là Id được dùng để lấy kết quả chạy Macro.
- Lấy kết quả thông qua phương thức GET tới https://excel.autodn.app/api/get/runMacroResult?key={commandId}. (Sau khi POST bạn nên chờ 1-2 giây mới gọi lệnh GET để chắc chắn Server đã chạy Macro xong).

PS: Hàm API này phục vụ nhiều ngôn ngữ nên mình không thiết kế real-time 2 chiều.